<html>
<head>
	<meta name="decorator" content="ani"/>
	<link href="${ctxStatic}/plugin/jstree/jstree.min.css" rel="stylesheet" type="text/css"/>
	<script src="${ctxStatic}/plugin/jstree/jstree.min.js" type="text/javascript"></script>
	<script>
		var operData = [];//两个列表总信息
        var sumData = [];//所有的选中信息
        var idData = [];//上次选中的信息
        $(document).ready(function() {
            initUeAllOper('0');//加载指标列表
            initUeCheckedOper();//加载绑定指标列表
        })

		function initUeAllOper(type) {
            $('#ue_all_oper')
                .bind('loaded.jstree', function (e, data) {
                    data.instance.open_all();//打开所有的节点
                    data.instance.clear_state();//此句用来清除之前选中的数据不可以去掉
                })
                .jstree({
                    'core' : {
                        "themes" : {
                            "responsive": true,
                            "dots": false,//是否显示树连接线
                            "ellipsis": true,//节点名过长时是否显示省略号
                            "icons": false
                        },
                        "check_callback" : true,
                        'data' : function (obj, callback) {
                            var jsonstrAll="[]";
                            var jsonarrayAll = eval('('+jsonstrAll+')');
                            $.ajax({
                                type: "POST",
                                url:"${ctx}/paevaluationindex/paEvaluationIndex/datatree1?indicatorType=${indicatorType}&paAnnualMissionId=${id}&type=" + type,
                                dataType:"json",
                                async: false,
                                success:function(result) {
                                    var arrays= result;
                                    for(var i=0 ; i<arrays.length; i++){
                                        var name = arrays[i].indicator == '0'?arrays[i].name + '▲':arrays[i].indicator == '1'?arrays[i].name + '★':arrays[i].name
                                        var arr = {
                                            "id":arrays[i].id,
                                            "parent":arrays[i].parentId == '0'?"#":arrays[i].parentId,
                                            "text":name
                                        }
                                        jsonarrayAll.push(arr);
                                    }
                                    operData = operData.concat(jsonarrayAll);
                                }
                            });
                            callback.call(this, jsonarrayAll);
                        }
                    },
                    "checkbox" : {
                        "keep_selected_style" : false,
                    },
                    "plugins" : [ "state",'checkbox','types','themes','contextmenu' ],
                    'state': {
                        "opened":true
                    }
                });
        }

        function initUeCheckedOper() {
            $("#ue_checked_oper")
                .bind('loaded.jstree', function (e, data) {
                    data.instance.open_all();
                })
                .bind("create_node.jstree", function(e, data) {
                    data.instance.open_all();
                })
                .jstree({
                    'core' : {
                        "themes" : {
                            "responsive": true,
                            "dots": false,//是否显示树连接线
                            "ellipsis": true,//节点名过长时是否显示省略号
                            "icons": false
                        },
                        "check_callback" : true,
                        'data' : function (obj, callback) {
                            var jsonstr="[]";
                            var jsonarray = eval('('+jsonstr+')');
                            $.ajax({
                                type: "POST",
                                url:"${ctx}/paevaluationindex/paEvaluationIndex/datatree2?paAnnualMissionId=${id}",
                                dataType:"json",
                                async: false,
                                success:function(result) {
                                    var arrays= result;
                                    for(var i=0 ; i<arrays.length; i++){
                                        var name = arrays[i].indicator == '0'?arrays[i].name + '▲':arrays[i].indicator == '1'?arrays[i].name + '★':arrays[i].name
                                        var arr = {
                                            "id":arrays[i].id,
                                            "parent":arrays[i].parentId == '0'?"#":arrays[i].parentId,
                                            "text":name
                                        }
                                        jsonarray.push(arr);
                                        idData.unshift({'par': arrays[i].parentId == '0'?"#":arrays[i].parentId,'data':{ 'id' :  arrays[i].id ,'text' :  arrays[i].name},'sort': arrays[i].id });
                                    }
                                    operData = operData.concat(jsonarray);
                                }
                            });
                            callback.call(this, jsonarray);
                        }
                    },
                    "checkbox" : {
                        "keep_selected_style" : false,
                    },
                    "plugins" : [ "state",'types','themes','contextmenu' ],
                    'state': {
                        "opened":true,
                    }
                });
        }

        //树左右联动
        function removeOper(treeFrom,treeTo) {
            var ref = $('#'+treeFrom).jstree(true),
                sel = ref.get_selected();
            if(!sel.length) { return false; }
            var data = [];
            var addData = [];
            for(var i = 0;i<sel.length;i++){
                //选择节点
				//节点
                var obj = ref.get_json(sel[i]);
                //父id
                var parent = ref.get_parent(obj);
                //选择节点的所有父text
                var path = ref.get_path(sel[i]);
                var node = obj;
                addData.unshift({'par': parent,'data':{ 'id' :  obj.id ,'text' :  obj.text},'sort': obj.id});
                //获取所选节点全路径节点
                for(var j = 0 ; j < path.length-1;j++){
                    var nodeId = ref.get_parent(node);
                    node = ref.get_node(nodeId);
                    var nodeJson = ref.get_json(node);
                    var upParent = ref.get_parent(node);
                    addData.unshift({'par': upParent,'data':{ 'id' :  nodeJson.id ,'text' :  nodeJson.text},'sort': nodeJson.id});
                }
            }
            //加入右侧前一次的信息
            sumData = sumData.concat(idData);
            //加入左侧选择信息
            sumData = sumData.concat(addData);
            //排序
            sumData.sort(function(a,b) {
                return a.sort - b.sort
            })
			//删除所有节点重新排序渲染
            $('#'+treeTo).jstree(true).delete_node(operData);
            //添加被选择的节点及其父节点
            for(var i = 0 ; i < sumData.length;i++){
                addOper(treeTo,sumData[i].par,sumData[i].data);
            }
            //删除节点
            ref.delete_node(sel);
        };
		//添加
        function addOper(treeTo,parent,data) {
            var ref = $('#'+treeTo).jstree(true);
            var id = ref.get_node(data.id);
            if(id){
                return;
            }
            ref.create_node(parent, data,"last");
        };
        //清空
		function clearOper() {
		    //清空
            sumData = [];
            idData = [];
            //销毁
            $.jstree.destroy ();
			//再次渲染
            initUeAllOper('1');
            //再次渲染一个空的绑定指标树
            $("#ue_checked_oper")
                .bind('loaded.jstree', function (e, data) {
                    data.instance.open_all();
                })
                .bind("create_node.jstree", function(e, data) {
                    data.instance.open_all();
                })
                .jstree({
                    'core' : {
                        "themes" : {
                            "responsive": true,
                            "dots": false,//是否显示树连接线
                            "ellipsis": true,//节点名过长时是否显示省略号
                            "icons": false
                        },
                        "check_callback" : true,
                        'data' : function (obj, callback) {
                            var jsonstr="[]";
                            var jsonarray = eval('('+jsonstr+')');
                            callback.call(this, jsonarray);
                        }
                    },
                    "checkbox" : {
                        "keep_selected_style" : false,
                    },
                    "plugins" : [ "state",'types','themes','contextmenu' ],
                    'state': {
                        "opened":true,
                    }
                });
        }
        //设置指标
        function bindIndex(){
            var indexIds = '';
            if(!sumData.length) {
                jp.error("请设置指标！")
                return false;
            }
            var obj = {};
            var objData = sumData.reduce(function(item, next) {
				obj[next.data.id] ? '' : obj[next.data.id] = true && item.push(next);
				return item;
			},[])
            for(var i in objData) {
                indexIds += objData[i].data.id + ',';
            }
            $.ajax({
                url:"${ctx}/paevaluationindex/paEvaluationIndex/insertEvaluation?paAnnualMissionId=${id}&indexIds="+indexIds+"&indicatorType=${indicatorType}",
                method:"get",
                contentType: "application/json;charset-UTF-8",
                dataType:"json",
                success:function(data,textStatus,jqXHR) {
                    if(data.success) {
                        jp.getParent().refresh();
                        jp.success(data.msg);
                        var dialogIndex = parent.layer.getFrameIndex(window.name); // 获取窗口索引
                        parent.layer.close(dialogIndex);
                    }
                }
            })
        }

	</script>
</head>
<body style="background-color: #ffffff;">
<style>
    .contain {margin: 25px 25px 25px 25px;}
    .index {border: 1px solid #ddd;overflow-y:auto;border-radius: 4px;width: 375px;height: 575px;}
    .index-left {float: left}
    .index-right {float: right}
    .index-text {font-size: 15px;margin: 7px 0px 7px 7px;}
    .index-text-a {font-size: 13px;text-decoration:underline;float: right;margin-right: 5px;margin-top: 2px;}
    .index-border {border-top: 1px solid #ddd;}
    .index-add {width: 110px;height: 440px;display: inline-block}
    .index-add-btn {margin: 271px 0px 271px 24px}
    .index-tree {margin:10px 0px 0px 10px;}
</style>
<div class="contain">
	<div class="index index-left">
		<div class="index-text">请选择指标</div>
		<div class="index-border">
            <div class="demo-transfer index-tree" id="ue_all_oper"></div>
        </div>
	</div>
	<div class="index-add">
        <span class="btn btn-default index-add-btn" onclick="removeOper('ue_all_oper','ue_checked_oper')">添加>></span>
	</div>
	<div class="index index-right">
		<div class="index-text">已选指标
			<a class="index-text-a" onclick="clearOper('ue_all_oper')">全部清空</a>
		</div>
		<div class="index-border">
            <div class="demo-transfer index-tree" id="ue_checked_oper"></div>
        </div>
	</div>
</div>
</body>
</html>
